<%@ include file="/WEB-INF/views/taglib.jsp" %>
<h3>Stock Adjustment Form </h3>	
	<form:form id="form" method="post" modelAttribute="assetTransaction" cssClass="simpleForm">
		<input type="hidden" name="createType" value="COMPONENT" />
		<form:hidden path="assetTransactionId" />
		
		<div class="action">
	  	<c:choose>
	  		<c:when test="${assetTransaction.assetTransactionId==null}">
	  			<button type="button" class="button positive" onclick="formSubmit()">
	  			Save
	  			</button>
	  			<a href="<c:url value="/stockAdjustment/search" />" class="button">Back</a>
	  		</c:when>
	  		<c:when test="${assetTransaction.assetTransactionId!=null}">
  				 	  			
  				<a href="<c:url value="/stockAdjustment/search" />" class="button">Back</a>
  				
	  		</c:when>
	  	</c:choose>
	 	</div>	
	 	<div class="clear" style="height:1px">&nbsp;</div>
		<jsp:include page="/WEB-INF/views/message.jsp"></jsp:include>
	
	  	<fieldset>
	  		<legend>Stock Adjustment Info</legend>
	  		<div class="span-12">
	  		<aims:column cssErrorClass="error" path="assetType" cssClass="clearfix">
	  		<label>
	  			Asset Type  
	 		</label>
	  		
	  		<c:if test="${assetTransaction.assetTransactionId==null}">
	  		<form:select id="assetType" path="assetType" onchange="transactionTypeChange()">
	  			<form:option value="EQUIPMENT">Equipment</form:option>
	  			<form:option value="COMPONENT" selected="selected">Component</form:option>
	  		</form:select>
	  		</c:if>
	  		<c:if test="${assetTransaction.assetTransactionId!=null}">
	  		<form:select id="assetType" path="assetType" disabled="true">
	  			<form:option value="COMPONENT" selected="selected">Component</form:option>
	  		</form:select>
	  		</c:if>
	  		
	  		<form:errors path="assetType"  cssClass="errorSimple" /> 
			</aims:column>
	  		<aims:column cssErrorClass="error" path="assetTransactionType" cssClass="clearfix">
	  		<label>
	  			Adjustment Type  * 
	 		</label>
	 		
	 		<c:if test="${assetTransaction.assetTransactionId==null}">
	  		<form:select id="assetTransactionSubType" path="assetTransactionSubType" onchange="selectChange()">
	  			<form:option value="IN">IN</form:option>
	  			<form:option value="OUT">OUT</form:option>
	  		</form:select>
	  		</c:if>
	  		<c:if test="${assetTransaction.assetTransactionId!=null}">
	  		<form:select id="assetTransactionSubType" path="assetTransactionSubType" disabled="true">
	  			<form:option value="IN">IN</form:option>
	  			<form:option value="OUT">OUT</form:option>
	  		</form:select>
	  		</c:if>
	  		
	  		<form:errors path="assetTransactionType"  cssClass="errorSimple" /> 
			</aims:column>
			
			<aims:column cssErrorClass="error" path="fromLocation.locationId" cssClass="clearfix">
	  		<label>
	  			Company Code
	 		</label>

	  		<c:if test="${assetTransaction.assetTransactionId==null}">
	  		<form:select id="companyCode" path="companyCode" class="companyCode" onchange="selectChange()">
	  			<form:options items="${globalCompanyCode}" itemValue="systemCode1" itemLabel="systemCodeValueDescription" />
	  		</form:select> 
	  		</c:if>
	  		<c:if test="${assetTransaction.assetTransactionId!=null}">
	  		<form:select id="companyCode" path="companyCode" class="companyCode" disabled="true">
	  			<form:options items="${globalCompanyCode}" itemValue="systemCode1" itemLabel="systemCodeValueDescription" />
	  		</form:select> 
	  		</c:if>
	  		
	  		<form:errors path="fromLocation.locationId"  cssClass="errorSimple" /> 
			</aims:column>
			</div>
			
			<div class="span-8">
			<aims:column cssErrorClass="error" path="assetTransactionCode"  cssClass="clearfix">
	  		<label>
	  			Stock Adjustment Code  
	 		</label>
	  			${assetTransaction.assetTransactionCode } 
			</aims:column>
			<aims:column cssErrorClass="error" path="assetTransactionCode" cssClass="clearfix">
	  		<label>
	  			Stock Adjustment Date  
	 		</label>
				<fmt:formatDate value="${assetTransaction.dateCreated}" pattern="${globalDateFormatJava}"/>
	  			 
			</aims:column>
			</div>
			
			
			</fieldset>
			
			<fieldset>
				
				<div> <br> </div>
					<c:if test="${assetTransaction.assetTransactionId==null}">
					<input type="button" id="file-uploader" value="Import" class="button positiveDark right" />		
					</c:if>
					<input type="button" class="button positiveDark right" value = "Template" onclick="window.open('<c:url value="/resources/sample/stock_adjustment_Component.xls"></c:url>')"/>
				<div> <br> </div>	 
				<table id="info" class="gridSearch">
					<thead>
						<tr>
							<th>S/N</th>
		 				    <th>Location</th>
		 				    <th>Asset Model</th>
		 					<th>Difference in QTY</th>
		 					<th>Remarks</th>
						</tr>
					</thead>
					<tbody>
						<c:choose>
							<c:when test="${not empty assetTransaction.assetTransactionItems}">

								<c:forEach items="${assetTransaction.assetTransactionItems}" var="item" varStatus="status">
								
									<tr <c:if test="${(status.count%2)==0 }"> class="alt"</c:if>>
										<td>${status.index+1}</td>
										<td>${item.location.locationName}</td>		
										<td>${item.assetModel.assetModelCode}-${item.assetModel.assetModelName}</td>		
										<td>${item.assetTransactionQuantity}</td>
										<td>${item.remarks}</td>				
									</tr>
								</c:forEach>
							</c:when>

						</c:choose>
			
					</tbody>
				</table>
				
		</fieldset>
			
      <div class="action">
	  	<c:choose>
	  		<c:when test="${assetTransaction.assetTransactionId==null}">
	  			<button type="button" class="button positive" onclick="formSubmit()">
	  			Save
	  			</button>
	  			<a href="<c:url value="/stockAdjustment/search" />" class="button">Back</a>
	  		</c:when>
	  		<c:when test="${assetTransaction.assetTransactionId!=null}">
  				 	  			
  				<a href="<c:url value="/stockAdjustment/search" />" class="button">Back</a>
  				
	  		</c:when>
	  	</c:choose>
	 </div>	
	</form:form>
	
	<table id="tmpTable" style="visibility:hidden">
		<tr class="new">
		
		<input name="assetTransactionItems.assetModel.assetModelId" type="hidden"  class="assetModelId" />
		<input name="assetTransactionItems.assetModel.assetModelName" type="hidden" />
		<input name="assetTransactionItems.assetModel.assetModelCode" type="hidden" />
		<input name="assetTransactionItems.location.locationId" type="hidden" />
		<input name="assetTransactionItems.location.locationName" type="hidden" />
		<input name="assetTransactionItems.assetTransactionQuantity" type="hidden" />
		<input name="assetTransactionItems.deleted" type="hidden" />


		<td>	  	
	  	<span class="indexSNo"></span>	  	
	  	</td> 	
	  	
	  	<td>	
	  	<span class="locationName"></span>
	  	</td>
	  	
	  	<td>	
	  	<span class="assetModelName"></span>
	  	</td>
	  	  				
		<td>	  	
	  	<span class="assetTransactionQuantity"></span>
	  	</td> 
	  	
	  	<td>	
	  	<span style="color:red;" class="remarks"></span>
	  	</td>
	  	
	  	  		  	
		</tr>
	</table> 
	
	
	<script type="text/javascript">
	
		var countRows = 0;	
		var validateRows = 0;
		

		$(document).ready(function() {
			
			<c:if test="${assetTransaction.assetTransactionId==null}">
			
			var ajaxUpload = new AjaxUpload('file-uploader', {
				 action: '<c:url value="/stockAdjustment/importComponent" />?assetTransactionSubType=IN',
				  // File upload name
				  name: 'excelFile',
				  // Submit file after selection
				  autoSubmit: true,
				  responseType: 'json',
				  onSubmit: function(file, extension) {
					  if (! (/^(xls)$/i.test(extension))){
				            // extension is not allowed
				            alert('Error: only .xls allowed');
				            // cancel upload
				            return false;
				       }
					  document.body.style.cursor = 'wait';
					  $('#file-uploader').attr('disabled', true);
					  
				  },
				  onComplete: function(file, responseJSON) {	
					  $('#info tbody tr').remove();
					  document.body.style.cursor = 'pointer';
				  	  $('#file-uploader').removeAttr('disabled');
					  if(responseJSON.result!='')
				    	{		
				    		for(i=0;i<responseJSON.result.length;i++)
				    		{		    			
				    			var indexSNo = i+1;
				    			var assetModelCode = responseJSON.result[i].assetModel.assetModelCode;
				    			var assetModelName = responseJSON.result[i].assetModel.assetModelName!=null?responseJSON.result[i].assetModel.assetModelName:"";
				    			var assetModelId = responseJSON.result[i].assetModel.assetModelId!=null? responseJSON.result[i].assetModel.assetModelId:"-1";
				    			var quantity = responseJSON.result[i].assetTransactionQuantity;
				    			var locationId = responseJSON.result[i].location!=null?responseJSON.result[i].location.locationId:"";
				    			var locationName = responseJSON.result[i].location!=null?responseJSON.result[i].location.locationName:"";
				    			var deleted = responseJSON.result[i].deleted;
				    			addRow(indexSNo,assetModelId,assetModelCode,assetModelName,quantity,locationId,locationName,deleted);		    			
				    		}
				    	}
					  
					  else
					  {
					  alert('No Record found in the imported file');
					  }
				  
				  
				  if(responseJSON.format!=null && responseJSON.format=='error')
					{
					  alert('Pls do check the format you are trying to import');
					}
				  }
			});
			
			selectChange();			
			</c:if>
		});
		
		
		function selectChange(){
			var assetTransactionSubType =  $('#assetTransactionSubType').val();
			if(assetTransactionSubType == 'IN'){
				var action = '<c:url value="/stockAdjustment/importComponent" />?assetTransactionSubType=IN&companyCode=' + $("#companyCode").val();
			}else{
				var action = '<c:url value="/stockAdjustment/importComponent" />?assetTransactionSubType=OUT&companyCode=' + $("#companyCode").val();
			}
			ajaxUpload.setAction(action);			
		}
		
		function transactionTypeChange(){
			var assetType =  $('#assetType').val();
			if(assetType == "EQUIPMENT"){
				window.location.href='<c:url value="/stockAdjustment/create?createType=EQUIPMENT"/>';
			}else{
				window.location.href='<c:url value="/stockAdjustment/create?createType=COMPONENT"/>';
			}
		}
		
		function redirect(form,url){
			form.attr('action',url );
			form.submit();
		}
		
		function formSubmit(){
			if(validateForm()){
				var url = "<c:url value="/stockAdjustment/create"/>";
				var form = $('#form');				
				redirect(form,url);
			}
		}
		
		function validateForm(){
			var res = true;
			var countEquip = $('#countEquip').val();
			if(validateRows<=0)
			{		 
				alert(" No valid record in imported file to start processing Stock Adjustment");
				res = false;
				return res;
				
			}	
			return res;
			
		}
		
	
		function addRow(indexSNo,assetModelId,assetModelCode,assetModelName,quantity,locationId,locationName,deleted)
		{
			var row = $('#tmpTable tr').clone();
			var rowSize = $('#info tbody tr').size();
			if(!deleted){
				validateRows++;
				$('.remarks',row).text("");
				$('.assetModelName',row).text(assetModelCode);
			}
			else
			{
				$('.remarks',row).text("Invalid Record. This record wont be inserted.");
				$('.assetModelName',row).text(assetModelCode);
			}
			
			
			$('input[name=assetTransactionItems.assetModel.assetModelId]',row).val(assetModelId).attr('name','assetTransactionItems['+countRows+'].assetModel.assetModelId');
			$('input[name=assetTransactionItems.assetModel.assetModelName]',row).val(assetModelName).attr('name','assetTransactionItems['+countRows+'].assetModel.assetModelName');
			$('input[name=assetTransactionItems.assetModel.assetModelCode]',row).val(assetModelCode).attr('name','assetTransactionItems['+countRows+'].assetModel.assetModelCode');
			$('input[name=assetTransactionItems.location.locationId]',row).val(locationId).attr('name','assetTransactionItems['+countRows+'].location.locationId');
			$('input[name=assetTransactionItems.location.locationName]',row).val(locationName).attr('name','assetTransactionItems['+countRows+'].location.locationName');
			$('input[name=assetTransactionItems.assetTransactionQuantity]',row).val(quantity).attr('name','assetTransactionItems['+countRows+'].assetTransactionQuantity');
			$('input[name=assetTransactionItems.deleted]',row).val(deleted).attr('name','assetTransactionItems['+countRows+'].deleted');
		
			$('.locationName',row).text(locationName);
			$('.indexSNo',row).text(indexSNo);
			$('.assetTransactionQuantity',row).text(quantity);
			
			row.appendTo('#info tbody');
			countRows++;
		}



		
		

	</script>	